{% extends "/based/based.html" %}
{% block content %}
 <script src="{{url_for('static',filename='js/plotly-latest.min.js')}}"></script>
	<main class="page-content">
	<form method="POST" name = "memo">
	<style>
	.volvo{color: black;}
	.saab{color: red;}
	.txt_area{color:black;}
	</style>
	
	<br>
	 <table align="center" border="0" style="width: 80%; ">
		<tbody>
			<tr>
				<td >
					<div align="center" style="text-align:center" id="fourth" class="buttonBox" type="submit" value = "select"/> 
					  <button name='submit_button' value='select'>确定</button>
					  <div class="border"></div>
					  <div class="border"></div>
					  <div class="border"></div>
					  <div class="border"></div>
					</div> 
				</td>
				<td><br>
					<select id="cod" size=5 name="cod" class="volvo" style="vertical-align: middle;">	
						  <option id='select_cod' name="select_cod" checked>{{select_cod}}</option>
						  <option>-------- </option> 
						  
			        	  {%for i in range(0,cod_cn|length) %} 
			        	 	 <option>{{cod_cn[i]}}</option> 
			        	  {% endfor %}
					       
					</select>
					<br><br>
				</td>
				
				
				<td>
					多空<br>
					
					<input name="cp" type="radio" value="C" {% if cp_last_checked=='C' %}checked {% endif %}/>CALL
					&nbsp;&nbsp;&nbsp;
				    <input name="cp" type="radio" value="P" {% if cp_last_checked=='P' %}checked {% endif %}/>PUT 
				</td>
				<td>
					  <div align="bottom" style="text-align:center" id="fourth" class="buttonBox" type="submit" value = "iv_curve"/> 
							  <button name='submit_button' value="iv_curve">波动率曲线</button>
							  <div class="border"></div>
							  <div class="border"></div>
							  <div class="border"></div>
							  <div class="border"></div>
							</div> 
				
				</td>
				
			</tr>
			<tr>
				<td>
				</td>
				<td>
					选择期权合约<br>
					
					<select id="opt_cod" size=1 name="opt_cod" class="volvo" style="vertical-align: middle;">	
						  <option>{{select_opt_cod}}</option>
						  <option>-------- </option> 
			        	  {%for i in range(0,opt_cod|length) %} 
			        	 	 <option>{{opt_cod[i]}}</option> 
			        	  {% endfor %}
					       
					</select>
				</td>
				<td>
				</td>
				<td>
				</td>
			</tr>
			
			{% if not select_opt_cod=='' %}
			<tr>
				<td>
					
					
				</td>
				
				<td>
					利率(%):<br>
					<input name="interestRate" type="text" class="volvo" value="{{lastOptData['interestRate']}}">
				</td>
				
				<td>
					剩余天数	<br>
					<input name="dayToExp" type="text" class="volvo" value="{{lastOptData['dayToExp']}}">
				</td>
				<td>
					期货现价或目标价<br>
					<input name="underlyingPrice" type="text" class="volvo" value="{{lastOptData['underlying_price']}}">
				</td>
			</tr>
			
			<tr>	
				</td>
				<td>
				<td>
					行权价<br>
					<input name="strikePrice" type="text" class="volvo" value="{{lastOptData['strikePrice']}}">
				</td>
				<td>
					波动率 *<br>
					<input name="volatility" type="text" class="volvo" value="{{lastOptData['vo']}}">
				</td>	
				<td>
					期权现价或目标价<br>
					<input name="opt_price" type="text" class="volvo" value="{{lastOptData['lastPrice_opt']}}">
				</td>	
			</tr>
			<tr>	
				</td>
				<td>
				</td>
				<td>
				<td>
					* 波动率参考以下历史波动率（W- 周  M- 月）
				</td>
				</td>
				<td>
			</tr>
				
			<tr>
			<br>
			</tr>
			 
			<tr>
		        <td>
			        <div align="bottom" style="text-align:center" id="fourth" class="buttonBox" type="submit" value = "caluQQPrice"/> 
							  <button name='submit_button' value='caluQQPrice'>期权理论计算</button>
							  <div class="border"></div>
							  <div class="border"></div>
							  <div class="border"></div>
							  <div class="border"></div>
							</div> 
			        
			        </td>
			        <td>
			        	期权理论估价:
			       		<span style="background-color: rgb(79, 129, 189); color: rgb(255, 255, 255); font-size: 28px;"><br>
			       		{{'' if theoPrice==-99.0 else theoPrice}}
			       		</span>
			       		
			       		<br>(期权实际现价:{{lastOptData['lastPrice_opt']}}
			       		{% if theoPrice!=-99.0 %}
			       		 , 比理论价{{"高: +" if lastOptData['lastPrice_opt']>theoPrice else "低: "}}
			       		 {{"%.2f%%"|format(((lastOptData['lastPrice_opt']/theoPrice)-1.0)*100.0)}}
			       		{% endif %}
			       		)
			        </td>
			        <td>
			        	隐含波动率:
			        	<span style="background-color: rgb(79, 129, 189); color: rgb(255, 255, 255); font-size: 28px;"><br>
			        	{{'' if iv==-99.0 else iv}}
			        	</span>
			       		<br>&nbsp;&nbsp;&nbsp;
			        </td>
			        <td>
			        </td>
			   </tr>
			   
			   {% endif %}	
			   <tr>
			   <br><br><br><br><br><br><br><br>
			   </tr>
			   <tr>
		        <td>
			      
			        
			        </td>
			        <td>
			        {{iv_curve['iv_c']|safe}}
			        
			        </td>
			        <td>
			        {{iv_curve['iv_p']|safe}}
			        </td>
			        <td>
			        </td>
			   </tr>
			   
			   <tr>
		        <td>
			        </td>
			        <td>
			        {{iv_curve['iv_c_norm']|safe}}
			        
			        </td>
			        <td>
			        {{iv_curve['iv_p_norm']|safe}}
			        </td>
			        <td>
			        </td>
			   </tr>
			  
			 
	    </tbody>
	    </table>
	    <br><br>
            
		{% if not select_cod=='' %}
		 <br>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;历史波动率
		 <br>{{hv_tbl|safe }}
		 <br> &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;{{hv_plot|safe}}
         <br>	
         {% endif %}
	 </form>
		
	
{% endblock %}